import { defineComponent, onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import Article from '../../components/Article';

export default defineComponent({
    name: 'Home',
    setup(props) {
        const router = useRouter();
        const name:any = router.currentRoute.value.name;
        const data = ref();
        onMounted(() => {
            fetch(`../../../json/${name}.json`)
                .then(response => {
                    return response.json();
                })
                .then(result => {
                    data.value = result;
                });
        });

        return () => {
            return (
                <div>
                    {data.value && <Article data={data.value} />}
                </div>
            )
        }
    }
})
